A5.ControlBarshowDisclosure Method
Syntax
Arguments
- settingsobject
The disclosure settings.
- namestring
Either the name of a disclosure to show (defined in A5.ControlBar.disclosures), or the name of a layout to dynamically show in the layout disclosure. In order to show a layout, start the string with "layout:". If a layout named "menu" was to be shown, the value would be "layout:menu".
- typestring
The type of disclosure. The values can be "expand-before", "expand-after", "expand-element", "expand-element-cover", "extend", "extend-element", "extend-element-cover", "flyout", "flyout-element", "flyout-element-cover", "cover", "outside-before", "outside-after", "screen-left", "screen-right", "screen-top" and "screen-bottom". A value of "explicit" can be used in conjunction with the "rectanlge" setting to show the disclosure at an explicit location.
- sizestring
The size to make the disclosure. Options are a CSS size value (like "300px"), or "fill". A value of "fill" will make the disclosure fill the available area. For an "extend" type this will be to the far side of the screen, for an "expand" type this will be to the far edge of the control bar.
- marginobject
The margins to use on the disclosure.
- topnumberstring
The top margin as either a number of pixels, or in CSS units.
- leftnumberstring
The left margin as either a number of pixels, or in CSS units.
- rightnumberstring
The right margin as either a number of pixels, or in CSS units.
- bottomnumberstring
The bottom margin as either a number of pixels, or in CSS units.
- animationbooleanobject
Whether or not to animate the showing of the disclosure. If an object, animation specifics can be set.
- durationnumber
The number of milliseconds the disclosure should take to animate in or out.
- tweenstring
The CSS "tween" for the disclosure animation. The default is "ease-in-out".
- autoHideboolean
Whether or not to automatically close the disclosure when the user clicks/taps off the disclosure.
- classNamestring
Optional override to the class name to place on the disclosure element.
- coverClassNamestring
Optional override to the class name to place on the element that covers the screen when the disclosure is shown.
- rectangleobjectfunction
For an "explicit" type, either an object that contains the definition of the rectangle on the screen to render the disclosure in, or function that returns a rectangle object that will be called any time the disclosure is resized so that the rectangle can be recalculated.
- leftnumber
The left edge of the clip rectangle in pixels.
- rightnumber
The right edge of the clip rectangle in pixels.
- topnumber
The top edge of the clip rectangle in pixels.
- bottomnumber
The bottom edge of the clip rectangle in pixels.
- edgenumber
The edge of the clip rectangle from which to show the disclosure.
- fillstring
How the disclosure should fill the clip rectangle. Options are "width", "height" and "both".
- elementelement
The element to use as reference for "extend" and "expand" types that use elements.
Description
Show a disclosure.
Discussion
The "expand" family of types will expand the disclosure over the control bar area. In a horizontal layout "before" is left and "after" is right, in a vertical layout "before" is top and "after" is bottom.
The "expand-element" type will expand the disclosure from the optionally passed in element, and "expand-element-cover" will do the same only covering the element.
The "extend" family will extend the disclosure away from the "edge" defined in A5.ControlBar.edge. By default "extend" will show the disclosure without occluding the control bar. For instance if the "edge" is "top" then the disclosure will dropdown from the bottom edge of the control bar.
The "extend-element" type will extend the disclosure from the optionally passed in element, and "extend-element-cover" will do the same only covering the element.
The "flyout" family will extend the disclosure away from the "edge" defined in A5.ControlBar.edge relative to the passed in element, giving the disclosure a menu like behavior. By default "flyout" will show the disclosure without occluding the control bar. For instance if the "edge" is "top" then the disclosure will dropdown from the bottom edge of the control bar.
The "flyout-element" type will extend the disclosure from the edge of the passed in element, and "flyout-element-cover" will do the same only covering the element.
The "cover" type will show the disclosure from the "edge" defined in A5.ControlBar.edge, sized to cover the entire control bar.
The "outside" family of types will show the disclosure over the area outside the control bar on the opposite side from the edge of the control bar.
The "screen" family of types will show the disclosure from the specified edge of the screen.
The "explicit" type will show the disclosure in the passed in custom "rectangle".
Example
// assume cbObj is a pointer to an instance of A5.ControlBar
// assume ele is a pointer to an BUTTON element in the control bar, the action of which runs this code
cbObj.showDisclosure({
name: 'more', // show the disclosure named "more"
type: 'extend-element', // extend from the passed in element
margin: {top: 10}, // add a margin of 10 pixels to the top of the disclosure
},ele);